<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<ui:composition>

	<p:tabView effect="fold" style="width:100%;">
		<p:tab title="#{msgs.basicInfo}">
			<p:panelGrid style="width:100%;height:100%">
				<p:row>
					<p:column rowspan="3" colspan="1" style="color:green">#{msgs.customerInfo}</p:column>
					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{orderModel.current.customer.lastName} #{orderModel.current.customer.firstName}</p:column>
				</p:row>
				<p:row>
					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{orderModel.current.customer.telephone}</p:column>

				</p:row>
				<p:row>
					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{orderModel.current.customer.address}</p:column>
				</p:row>
				<p:row>
					<p:column rowspan="3" colspan="1" style="color:green">#{msgs.pickUpInfo}</p:column>
					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{orderModel.current.customer.dropOffLocation.name}</p:column>
				</p:row>
				<p:row>

					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{orderModel.current.customer.dropOffLocation.address}</p:column>
				</p:row>
				<p:row>

					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{orderModel.current.requiredDate} #{orderModel.current.pickupTimeRangeLabel}</p:column>
				</p:row>
				<p:row>
					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{msgs.orderStatus}</p:column>
					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{orderModel.current.status.label}</p:column>
				</p:row>
				<p:row>
					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{msgs.memo}</p:column>
					<p:column rowspan="1" colspan="1"
						style="text-align:left;color:green">#{orderModel.current.comments}</p:column>
				</p:row>
				<p:row rendered="#{orderModel.current.promotionRewardRate > 0}">
					<p:column colspan="4"
						footerText="#{msgs.afterPayment}, #{msgs.youCanGet} #{orderModel.current.promotionRewardRateLabel} #{msgs.creditReward}"
						style="text-align:right" />
				</p:row>
			</p:panelGrid>
		</p:tab>
		<p:tab title="#{msgs.ordered}">
			<p:dataTable value="#{orderModel.current.orderDetails}"
				var="orderDetail" sortBy="1" style="width:100%;" paginator="true"
				paginatorAlwaysVisible="false" rows="7" rowClasses="oddRow, evenRow"
				rendered="#{orderModel.current.isAssociatedLoaded}">
				<p:column>
					<h:graphicImage library="images"
						value="../#{orderDetail.product.icon}32.png"></h:graphicImage>
					<h:outputLabel value="#{orderDetail.product.nameLabel}"></h:outputLabel>
					<h:outputLabel value=" #{msgs.plusTax}"
						style="color:blue;float:right" rendered="#{orderDetail.isTaxable}"></h:outputLabel>
				</p:column>
				<p:column headerText="#{msgs.quantity}">
					<h:outputText
						value=" #{orderDetail.orderedQuantity} #{orderDetail.product.stockUnitLabel}"
						style="float:right"></h:outputText>
				</p:column>
				<p:column headerText="#{msgs.price}">
					<h:outputLabel value="#{orderDetail.orderedPrice}">
						<f:convertNumber type="currency" currencySymbol="$"
							minFractionDigits="2" maxFractionDigits="2" />
					</h:outputLabel>
					<h:outputText value="/#{orderDetail.product.priceUnitLabel}"></h:outputText>
				</p:column>
				<p:column headerText="#{msgs.subtotal}">
					<h:outputLabel value="#{orderDetail.orderedSubTotal}"
						style="float:right">
						<f:convertNumber type="currency" currencySymbol="$"
							minFractionDigits="2" maxFractionDigits="2" />
					</h:outputLabel>
					<h:outputText value="≈"
						rendered="#{!orderDetail.product.isCanCaculateExactAmount}"
						style="float:right;font:green;font-size:1.2em"></h:outputText>
				</p:column>
				<p:columnGroup type="footer">
					<p:row>
						<p:column colspan="3" footerText="#{msgs.total}"
							style="text-align:right" />
						<p:column colspan="1"
							footerText="#{orderModel.current.orderedTotalAmountLabel}"
							style="text-align:right" />
					</p:row>
					<p:row rendered="#{orderModel.current.isTaxable}">
						<p:column colspan="3" footerText=" +  #{msgs.GST}"
							style="text-align:right">
						</p:column>

						<p:column colspan="1"
							footerText="#{orderModel.current.orderedTotalGSTLabel}"
							style="text-align:right" />
					</p:row>
					<p:row rendered="#{orderModel.current.isTaxable}">
						<p:column colspan="3" footerText=" +  #{msgs.QST}"
							style="text-align:right">
						</p:column>
						<p:column colspan="1"
							footerText="#{orderModel.current.orderedTotalQSTLabel}"
							style="text-align:right" />
					</p:row>
					<p:row rendered="#{orderModel.current.deliveryFee > 0.01}">
						<p:column colspan="3" footerText="+  #{msgs.deliveryFee}"
							style="text-align:right"></p:column>
						<p:column footerText="#{orderModel.current.deliveryFeeLabel}"
							style="text-align:right"></p:column>
					</p:row>
					<p:row rendered="#{orderModel.current.paidByCreditAmount > 0.01}">
						<p:column colspan="3" footerText=" - #{msgs.paidByCredit}"
							style="text-align:right"></p:column>
						<p:column
							footerText="#{orderModel.current.paidByCreditAmountLabel}"
							style="text-align:right"></p:column>
					</p:row>

					<p:row>
						<p:column colspan="3" footerText="#{msgs.charge}"
							style="text-align:right" />
						<p:column colspan="1"
							footerText="#{orderModel.current.orderedTotalChargeLabel}"
							style="text-align:right" />
					</p:row>
				</p:columnGroup>
			</p:dataTable>
		</p:tab>
		<p:tab title="#{msgs.confirmed}"
			rendered="#{orderModel.current.isAfterConfirmed}">
			<p:dataTable value="#{orderModel.current.orderDetails}"
				var="orderDetail" sortBy="1" style="width:100%;" paginator="true"
				paginatorAlwaysVisible="false" rows="7" rowClasses="oddRow, evenRow"
				rendered="#{orderModel.current.isAssociatedLoaded}">
				<p:column>
					<h:graphicImage library="images"
						value="../#{orderDetail.product.icon}32.png"></h:graphicImage>
					<h:outputLabel value="#{orderDetail.product.nameLabel}"></h:outputLabel>
					<h:outputLabel value=" #{msgs.plusTax}"
						style="color:blue;float:right" rendered="#{orderDetail.isTaxable}"></h:outputLabel>
				</p:column>
				<p:column headerText="#{msgs.quantity}">
					<h:outputText
						value=" #{orderDetail.confirmedQuantity} #{orderDetail.product.stockUnitLabel}"
						style="float:right"></h:outputText>
				</p:column>
				<p:column headerText="#{msgs.price}">

					<h:outputLabel value="#{orderDetail.confirmedPrice}">
						<f:convertNumber type="currency" currencySymbol="$"
							minFractionDigits="2" maxFractionDigits="2" />
					</h:outputLabel>
					<h:outputText value="/#{orderDetail.product.priceUnitLabel}"></h:outputText>
				</p:column>
				<p:column headerText="#{msgs.subtotal}">
					<h:outputLabel value="#{orderDetail.confirmedSubTotal}"
						style="float:right">
						<f:convertNumber type="currency" currencySymbol="$"
							minFractionDigits="2" maxFractionDigits="2" />
					</h:outputLabel>
					<h:outputText value="≈"
						rendered="#{!orderDetail.product.isCanCaculateExactAmount}"
						style="float:right;font:green;font-size:1.2em"></h:outputText>
				</p:column>


				<p:columnGroup type="footer">
					<p:row>
						<p:column colspan="3" footerText="#{msgs.total}"
							style="text-align:right" />
						<p:column colspan="1"
							footerText="#{orderModel.current.confirmedTotalAmountLabel}"
							style="text-align:right" />
					</p:row>
					<p:row rendered="#{orderModel.current.isTaxable}">
						<p:column colspan="3" footerText=" + #{msgs.GST}"
							style="text-align:right">
						</p:column>

						<p:column colspan="1"
							footerText="#{orderModel.current.confirmedTotalGSTLabel}"
							style="text-align:right" />
					</p:row>
					<p:row rendered="#{orderModel.current.isTaxable}">
						<p:column colspan="3" footerText=" + #{msgs.QST}"
							style="text-align:right">
						</p:column>
						<p:column colspan="1"
							footerText="#{orderModel.current.confirmedTotalQSTLabel}"
							style="text-align:right" />
					</p:row>
					<p:row rendered="#{orderModel.current.deliveryFee > 0.01}">
						<p:column colspan="3" footerText=" + #{msgs.deliveryFee}"
							style="text-align:right"></p:column>
						<p:column footerText="#{orderModel.current.deliveryFeeLabel}"
							style="text-align:right"></p:column>
					</p:row>

					<p:row rendered="#{orderModel.current.paidByCreditAmount > 0}">
						<p:column colspan="3" footerText=" - #{msgs.paidByCredit}"
							style="text-align:right"></p:column>
						<p:column
							footerText="#{orderModel.current.paidByCreditAmountLabel}"
							style="text-align:right"></p:column>
					</p:row>
					<p:row>
						<p:column colspan="3" footerText="#{msgs.charge}"
							style="text-align:right" />
						<p:column colspan="1"
							footerText="#{orderModel.current.confirmedTotalChargeLabel}"
							style="text-align:right" />
					</p:row>
				</p:columnGroup>
			</p:dataTable>
		</p:tab>
		<p:tab title="#{msgs.delivered}"
			rendered="#{orderModel.current.isAfterPrepared}">
			<p:dataTable value="#{orderModel.current.orderDetails}"
				var="orderDetail" sortBy="1" style="width:100%;" paginator="true"
				paginatorAlwaysVisible="false" rows="7" rowClasses="oddRow, evenRow"
				rendered="#{orderModel.current.isAssociatedLoaded}">
				<p:column>
					<h:graphicImage library="images"
						value="../#{orderDetail.product.icon}32.png"></h:graphicImage>
					<h:outputLabel value="#{orderDetail.product.nameLabel}"></h:outputLabel>
					<h:outputLabel value=" #{msgs.plusTax}"
						style="color:blue;float:right" rendered="#{orderDetail.isTaxable}"></h:outputLabel>
				</p:column>
				<p:column headerText="#{msgs.quantity}">
					<h:outputText
						value=" #{orderDetail.deliveredQuantity} #{orderDetail.product.priceUnitLabel}"
						style="float:right"></h:outputText>
				</p:column>
				<p:column headerText="#{msgs.price}">

					<h:outputLabel value="#{orderDetail.deliveredPrice}">
						<f:convertNumber type="currency" currencySymbol="$"
							minFractionDigits="2" maxFractionDigits="2" />
					</h:outputLabel>
					<h:outputText value="/#{orderDetail.product.priceUnitLabel}"></h:outputText>
				</p:column>
				<p:column headerText="#{msgs.subtotal}">
					<h:outputLabel value="#{orderDetail.deliveredSubTotal}"
						style="float:right">
						<f:convertNumber type="currency" currencySymbol="$"
							minFractionDigits="2" maxFractionDigits="2" />
					</h:outputLabel>
				</p:column>

				<p:columnGroup type="footer">
					<p:row>
						<p:column colspan="3" footerText="#{msgs.total}"
							style="text-align:right" />
						<p:column colspan="1"
							footerText="#{orderModel.current.deliveredTotalAmountLabel}"
							style="text-align:right" />
					</p:row>
					<p:row rendered="#{orderModel.current.isTaxable}">
						<p:column colspan="3" footerText=" + #{msgs.GST}"
							style="text-align:right">
						</p:column>

						<p:column colspan="1"
							footerText="#{orderModel.current.deliveredTotalGSTLabel}"
							style="text-align:right" />
					</p:row>
					<p:row rendered="#{orderModel.current.isTaxable}">
						<p:column colspan="3" footerText=" + #{msgs.QST}"
							style="text-align:right">
						</p:column>
						<p:column colspan="1"
							footerText="#{orderModel.current.deliveredTotalQSTLabel}"
							style="text-align:right" />
					</p:row>

					<p:row rendered="#{orderModel.current.deliveryFee > 0.01}">
						<p:column colspan="3" footerText="#{msgs.deliveryFee}"
							style="text-align:right"></p:column>
						<p:column footerText=" + #{orderModel.current.deliveryFeeLabel}"
							style="text-align:right"></p:column>
					</p:row>
					
					<p:row rendered="#{orderModel.current.paidByCreditAmount > 0}">
						<p:column colspan="3" footerText="#{msgs.paidByCredit}"
							style="text-align:right"></p:column>
						<p:column
							footerText=" - #{orderModel.current.paidByCreditAmountLabel}"
							style="text-align:right"></p:column>
					</p:row>
					<p:row>
						<p:column colspan="3" footerText="#{msgs.charge}"
							style="text-align:right" />
						<p:column colspan="1"
							footerText="#{orderModel.current.deliveredTotalChargeLabel}"
							style="text-align:right" />
					</p:row>
				</p:columnGroup>
			</p:dataTable>
		</p:tab>
	</p:tabView>
</ui:composition>
</html>